<template>
<div class="list">
    <el-row class="head">
        <el-col >——新增故障类别/故障类别</el-col>
    </el-row>
    <el-row class="title">
        <el-col>新增故障类别</el-col>
    </el-row>
    <el-form  :model="formdata" label-width="100px" class="formrule">
        <el-form-item label="维修分类">
            <el-select v-model="formdata.typeId" placeholder="全部">
                <el-option
                        v-for="item in options"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                >
                </el-option>
            </el-select>
        </el-form-item>

        <el-form-item>
            <el-button type="primary" @click="onSubmit(form)">查询</el-button>
        </el-form-item>
    </el-form>


    <el-table
            :data="type"
            border
            style="width: 100%">
        <el-table-column
                prop="type.name"
                label="分类"
                width="480">
        </el-table-column>
        <el-table-column
                prop="description"
                label="故障类别"
                width="480">
        </el-table-column>


        <el-table-column label="操作">
            <template slot-scope="scope">
                <el-button
                        size="mini"
                        @click="Alter(scope.$index, scope.row)">修改</el-button>
                <el-button
                        size="mini"
                        @click="Donew(scope.$index, scope.row)">新增解决方式</el-button>
                <el-button
                        size="mini"
                        @click="Solve(scope.$index, scope.row)">参看解决方式</el-button>
            </template>
        </el-table-column>
    </el-table>
    <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page.sync="formdata.page.pageNum"
            :page-sizes="[5, 10, 15, 20]"
            :page-size="10"
            layout="sizes, prev, pager, next"
            :total="total">
    </el-pagination>
</div>
</template>

<script>
    export default {
        name: "list",
        data() {
            return {
                formdata: {
                    typeId: '',
                    page: {
                        pageNum: 1,
                        pageSize:10
                    }
                },
                options:[],
                type:[],
                alterdata:{
                    id:'',
                    description:'',
            },
                donewdata:{
                    repairUserDescriptionId:'',
                    description:'',
            },
                total:''
            };
        },
        created() {
            this.getTypes();
        },
        methods:{
            onSubmit(){
                this.$axios.post("/api/v1/admin/description/list",this.formdata).then(result => {

                    return result.data;
                })
                    .then(data1 => {
                        this.type=data1.data.list;
                        this.total=data1.data.total;
                        console.log(data1.data);
                    });
            },
            //获取type列表
            getTypes()
            {
                this.$axios.post("/api/v1/user/type/list").then(result => {

                    return result.data;
                })
                    .then(data1 => {
                        this.options=data1.data;
                    });
            },
            Alter(index,data){
                this.$prompt('请输入故障类别 ', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    inputPattern: /\S{1,}/,
                    inputErrorMessage: '不能为空',
                    inputValue:data.description
                }).then(({ value }) => {
                    this.alterdata.id=data.id;
                    this.alterdata.description=value;
                    if (value!==data.description)
                    {
                        this.$axios.post("/api/v1/admin/description/update",this.alterdata).then(result => {

                            return result.data;
                        })
                            .then(data1 => {
                                console.log(data1);
                            });
                        this.$axios.post("/api/v1/admin/description/list",this.formdata).then(result => {

                            return result.data;
                        })
                            .then(data1 => {
                                this.type=data1.data.list;
                                this.total=data1.data.total;
                                console.log(data1.data);
                            });
                    }
                    this.$message({
                        type: 'success',
                        message: '故障类别修改为: ' + value
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消输入'
                    });
                });
            },
            Donew(index,data)
            {
                this.$prompt('请输入解决方式', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    inputPattern:  /\S{1,}/,
                    inputErrorMessage: '解决方式不为空'
                }).then(({ value }) => {
                    this.donewdata.repairUserDescriptionId=data.id;
                    this.donewdata.description=value;
                    this.$axios.post("/api/v1/admin/description/insertadmin",this.donewdata).then(result => {

                        return result.data;
                    })
                        .then(data1 => {
                            console.log(data1.data);
                        });
                    this.$message({
                        type: 'success',
                        message: '你的新增解决方式是: ' + value
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消输入'
                    });
                });
            },
            Solve(index,data){
                var id=data.id;
                this.$router.push({
                    path:`/fault/solvelist/${id}`
                })
            },
            handleSizeChange(val) {

                this.formdata.page.pageSize=val;
                this.onSubmit();
            },
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
                this.formdata.page.pageNum=val;
                this.onSubmit();
            }

        }
    }
</script>

<style scoped>
    .el-input{
        width: 600px;
    }
</style>